<!doctype html/>
<html>
	<head>
		<meta Charset="utf-8"/>
		<title>5 African Countries</title>
		
		<link href="styles/styles.css" rel="stylesheet" type="text/css"/>
		<script language="javascript" src="scripts/scripts.js">
				
		</script>
		
	</head>

	<body>
		<header>
			<h1 class=".mainheader">5 African Countries</h1>
		</header>
			<div>
				<img src="images/africa.png" alt="this is a picture of the African continent" id="picture"/>
				<img src="images/elephants.jpg" alt="this is a picture of two elephants" id="picture2"/>
			</div>
			
			<p id = "caption"></p>
			
			
			
		<nav>
			<p><a href="javascript:showEgypt()"class="menulinks">Egypt</a>
			<a href="javascript:showSouthAfrica()"class="menulinks">South Africa</a>
			<a href="javascript:showMadagascar()"class="menulinks">Madagascar</a>
			<a href="javascript:showCongo()"class="menulinks">D. R. Congo</a>
			<a href="javascript:showNiger()"class="menulinks">Niger</a></p>
			<p><a href="javascript:showCounter()"class="menulinks">FINISH</a></p>
		</nav>
			
		
			<p>Using the buttons above, you can see pictures from 5 of Africa's countries.</br>For more about these African countires, click <a href="countries.html">here</a>.</p>
		
	
	
	</body>
	
	
	
	
	<footer>
	
		<cite>This page's content comes from <a href="http://www.wikipedia.org" target="blank">Wikipedia</a></cite><br/>
		<cite>The images on this page come from <a href="http://www.creativecommons.org" target= "blank">Creative Commons</a></cite>
	
		<p>&copy; EVV 2011</p>
	</footer>
	
</html>